const Cesium = window.Cesium;
export default class  Fps {
  constructor(viewer) {
    this.viewer = viewer;
    this.scene = viewer.scene;
    this.canvas = viewer.canvas;
    this.camera = viewer.camera;
    this.ellipsoid = viewer.scene.globe.ellipsoid;
    this.flags = null;
    this.handler = null;
    this.enterButton = null;
    this.exitButton = null;

    this.keyDown = this.keyDown.bind(this);
    this.keyUp = this.keyUp.bind(this);
    this.renderEvent = this.renderEvent.bind(this);
  }

  start() {

    this.enterKeyBoardMouseRoamingMode();

  }

  stop() {
    this.removeEnterButton();
    this.exitKeyBoardMouseRoamingMode();
  }

  createEnterButton() {
    this.enterButton = document.createElement('button');
    this.enterButton.innerText = '开启';
    this.enterButton.style.position = 'absolute';
    this.enterButton.style.left = '20px';
    this.enterButton.style.top = '20px';
    this.enterButton.onclick = this.enterKeyBoardMouseRoamingMode.bind(this);
    document.body.appendChild(this.enterButton);
  }

  removeEnterButton() {
    if (this.enterButton) {
      this.enterButton.remove();
      this.enterButton = null;
    }
  }

  enterKeyBoardMouseRoamingMode() {
    console.log('进入漫游模式');
    this.scene.screenSpaceCameraController.enableRotate = false;
    this.scene.screenSpaceCameraController.enableTranslate = false;
    this.scene.screenSpaceCameraController.enableZoom = false;
    this.scene.screenSpaceCameraController.enableTilt = false;
    this.scene.screenSpaceCameraController.enableLook = false;

    this.flags = {
      looking: false,
      startPosition: null,
      endPosition: null,
      moveForward: false,
      moveBackward: false,
      moveLeft: false,
      moveRight: false,
      moveUp: false,
      moveDown: false,
    };

    this.handler = new Cesium.ScreenSpaceEventHandler(this.canvas);
    this.handler.setInputAction((movement) => {
      this.flags.looking = true;
      this.flags.startPosition = Cesium.Cartesian3.clone(movement.position);
      this.flags.endPosition = Cesium.Cartesian3.clone(movement.position);
    }, Cesium.ScreenSpaceEventType.LEFT_DOWN);

    this.handler.setInputAction((movement) => {
      this.flags.endPosition = movement.endPosition;
    }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

    this.handler.setInputAction(() => {
      this.flags.looking = false;
    }, Cesium.ScreenSpaceEventType.LEFT_UP);

    document.addEventListener('keydown', this.keyDown, false);
    document.addEventListener('keyup', this.keyUp, false);

    this.viewer.clock.onTick.addEventListener(this.renderEvent);
  }

  exitKeyBoardMouseRoamingMode() {
    console.log('退出漫游');
    if (this.handler) {
      this.handler.destroy();
      this.handler = null;
    }

    document.removeEventListener('keydown', this.keyDown, false);
    document.removeEventListener('keyup', this.keyUp, false);

    this.viewer.clock.onTick.removeEventListener(this.renderEvent);

    this.scene.screenSpaceCameraController.enableRotate = true;
    this.scene.screenSpaceCameraController.enableTranslate = true;
    this.scene.screenSpaceCameraController.enableZoom = true;
    this.scene.screenSpaceCameraController.enableTilt = true;
    this.scene.screenSpaceCameraController.enableLook = true;
  }

  keyDown(event) {
    let flagName = this.getFlagFromKeyCode(event.keyCode);
    if (typeof flagName !== 'undefined') {
      this.flags[flagName] = true;
    }
  }

  keyUp(event) {
    let flagName = this.getFlagFromKeyCode(event.keyCode);
    if (typeof flagName !== 'undefined') {
      this.flags[flagName] = false;
    }
  }

  renderEvent() {
    if (this.flags.looking) {
      let width = this.viewer.canvas.clientWidth;
      let height = this.viewer.canvas.clientHeight;
      let lookFactor = 0.05;
      let x = (this.flags.endPosition.x - this.flags.startPosition.x) / width;
      let y = -(this.flags.endPosition.y - this.flags.startPosition.y) / height;
      
      this.camera.lookRight(x * lookFactor);
      this.camera.lookUp(y * lookFactor);
    }

    let cameraHeight = this.ellipsoid.cartesianToCartographic(this.camera.position).height;
    let moveRate = cameraHeight / 100.0;
    
    if (this.flags.moveForward) {
      this.camera.moveForward(moveRate);
    }
    if (this.flags.moveBackward) {
      this.camera.moveBackward(moveRate);
    }
    if (this.flags.moveUp) {
      this.camera.moveUp(moveRate);
    }
    if (this.flags.moveDown) {
      this.camera.moveDown(moveRate);
    }
    if (this.flags.moveLeft) {
      this.camera.moveLeft(moveRate);
    }
    if (this.flags.moveRight) {
      this.camera.moveRight(moveRate);
    }
  }

  getFlagFromKeyCode(keyCode) {
    switch (keyCode) {
      case 'W'.charCodeAt(0):
        return 'moveForward';
      case 'S'.charCodeAt(0):
        return 'moveBackward';
      case 'Q'.charCodeAt(0):
        return 'moveUp';
      case 'E'.charCodeAt(0):
        return 'moveDown';
      case 'D'.charCodeAt(0):
        return 'moveRight';
      case 'A'.charCodeAt(0):
        return 'moveLeft';
      default:
        return undefined;
    }
  }
}

// // 初始化地球小部件
// let viewer = new Cesium.Viewer('cesiumContainer');

// // 创建 Fps 实例
// const fps = new Fps(viewer);

// // 开启漫游
// fps.start();

// 停止漫游
// fps.stop();
